<!DOCTYPE html>
<head>
    <meta charset="utf-8"/>
    <title>ECharts</title>
    <!-- 引入刚刚下载的 ECharts 文件 -->
    <link rel="stylesheet" th:href="@{/febs/css/index2.css}" media="all">
</head>

<body>
<div data-th-include="febs/views/travel/header"></div>
<div class="layui-fluid layui-anim febs-anim" id="febs-sellStat" lay-title="统计"
     xmlns:th="http://www.thymeleaf.org">
    <div class="layui-row febs-container">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body febs-table-full">
                    <div class="b">
                        <div class="h">
                            <h1>SARS 统计</h1>
                            <div class="showTime">当前时间：2021年1月5-0时54分14秒</div>
                            <script>
                                var t = null;
                                t = setTimeout(time, 1000); //開始运行
                                function time() {
                                    clearTimeout(t); //清除定时器
                                    dt = new Date();
                                    var y = dt.getFullYear();
                                    var mt = dt.getMonth() + 1;
                                    var day = dt.getDate();
                                    var h = dt.getHours(); //获取时
                                    var m = dt.getMinutes(); //获取分
                                    var s = dt.getSeconds(); //获取秒
                                    document.querySelector(".showTime").innerHTML =
                                        "当前时间：" +
                                        y +
                                        "年" +
                                        mt +
                                        "月" +
                                        day +
                                        "-" +
                                        h +
                                        "时" +
                                        m +
                                        "分" +
                                        s +
                                        "秒";
                                    t = setTimeout(time, 1000); //设定定时器，循环运行
                                }
                            </script>
                        </div>
                        <h3 class="switchYear">

                        </h3>
                        <div class="mainbox">
                            <div class="column">
                                <div class="panel">
                                    <div class="chart panel-li1">
                                        <div style="font-size: 24px;font-weight: bold;padding: 10px 0 10px 5px"><span>COVID-19 prevention tips</span></div>
                                        <ul>
                                            <li><span>CDC How COVID spreads</span><br/><span>https:www.baidu.com</span></li>
                                            <li><span>CDC Prevent getting sick</span><br/><span>https:www.asdfghj.com</span></li>
                                            <li><span>CDC Tips for daily life and coping</span><br/><span>https:www.zxcvbnhjkl.com</span></li>
                                        </ul>
                                    </div>
                                    <div class="panel-footer"></div>
                                </div>
                                <div class="panel">
                                    <div class="chart panel-li2">
                                        <div style="font-size: 24px;font-weight: bold;padding: 10px 0 10px 5px"><span>We can also help you</span></div>
                                        <ul>
                                            <li>1、Carry hand sanitizer and wear protective equipment such as masks and gloves.</li>
                                            <li>2、Keep away from crowded places and avoid close contact, which may increase the risk of infection.</li>
                                            <li>3、Don't bring food or drinks into the park. Try to eat at home.</li>
                                            <li>4、Maintain a healthy distance from others.</li>
                                        </ul>
                                    </div>
                                    <div class="panel-footer"></div>
                                </div>
                            </div>
                            <div class="column">
                                <div class="no" style="color: white">
                                    <div style="padding: 10px 0 10px 5px;font-weight: bold;">
                                        <span>Real time epidemic monitoring</span>
                                    </div>
                                    <hr/>
                                    <div class="no-mes">
                                        <ul>
                                            <li>Overseas input</li>
                                            <li><span style="font-size:24px;color: orange">26</span></li>
                                            <li>Real time compeard to yesterday<span style="color: orange">+2</span></li>
                                        </ul>
                                    </div>
                                    <div class="no-mes">
                                        <ul>
                                            <li>Asymptomatic patient</li>
                                            <li><span style="font-size:24px;color: brown">96</span></li>
                                            <li>Real time compeard to yesterday<span style="color: brown">+4</span></li>
                                        </ul>
                                    </div>
                                    <div class="no-mes">
                                        <ul>
                                            <li>Existing diagnosis</li>
                                            <li><span style="font-size:24px;color: red">78</span></li>
                                            <li>Real time compeard to yesterday<span style="color: red">-16</span></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="map">
                                    <div style="padding: 10px 0 10px 5px;font-weight: bold;"><span>COVID-19 map distribution</span></div>
                                    <div class="chart"></div>
                                    <div class="map1"></div>
                                    <div class="map2"></div>
                                    <div class="map3"></div>
                                </div>
                            </div>
                        </div>
                        <script th:src="@{/echarts/echarts.min.js}"></script>
                        <script th:src="@{/echarts/china.js}"></script>
                        <script th:src="@{/echarts/myMap.js}"></script>
                        <script th:src="@{/layui/layui.js}"></script>
                        <script th:src="@{/layui/layui.all.js}"></script>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>

